/**
 * Created by Ysssssss on 2021/6/2.
 */

import React, { PureComponent } from 'react'
import { Button } from "antd";
import LiveSvg from "@assets/svg/live.svg";
import {withRouter} from "react-router";
import { getAppName } from "@utils/vars";

@withRouter
class IntroductionPage extends PureComponent {
    goReleasePage () {
        this.props.history.push({
            pathname: '/third-party/wechat/release',
            state: { redirect: true }
        })
    }

    render () {
        return (
            <div className="thirdparty-introduction-page">
                <div className="introduction-content">
                    <div className="flex-vertical-center">
                        <span className="ft-32">{getAppName()}</span>
                        <span className="ft-14 mgr-12 mgl-12">X</span>
                        <span className="ft-32">微信直播</span>
                    </div>
                    <div className="mgt-16 ft-clr-ml ft-16">构建“社交+电商+直播”新模式，抓住直播带货的机会红利</div>
                    <div className="ft-14 mgt-36"
                         style={{lineHeight: '32px'}}
                    >
                        微信直播作为微信生态基础的一环，因其高互动性、强场景带入感的特征，可为品牌小程序实现品牌宣传、引流增粉、带货转化等多重目的。
                    </div>
                    <Button type="primary"
                            className="button-large mgt-60"
                            style={{width: '148px'}}
                            onClick={this.goReleasePage.bind(this)}
                    >立即启用</Button>
                </div>
                <LiveSvg className="introduction-image" />
            </div>
        )
    }
}

export default IntroductionPage